<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的订单</title>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/myorder.css">
</head>
<div class="container">
    <div class="header">
        <h1>我的订单</h1>
        <img src="./images/myorder/listen.png" alt="">
        <div class="clear"></div>
        <div class="navigation">
            <ul>
                <li><a href="#">
                    <p>全部</p> 
                    <div class="clear"></div>
                </a>
            </li>
                <li><a href="#">
                    <p>待支付</p>
                </a></li>
                <li><a href="#">
                    <p>已支付</p>
                </a></li>
                <li><a href="#">
                    <p>已关闭</p>
                </a></li>
                <div class="clear"></div>
            </ul>
        </div>
    </div>
    
    <div class="content">
        <ul>
            <li><a href="#">
                <div class="status">
                    <p>订单编号：abc12345678910<span>待支付</span></p>
                </div>
                <div class="box">
                     <img src="./images/myorder/pic1.jpg" alt="">
                </div>
                <h3>
                    <span>套餐</span>
                    西式早餐搭配豆浆汉堡搭配限时优惠西式早餐搭配豆浆汉堡搭配
                    西式早餐搭配豆浆汉堡搭配限时优惠西式早餐搭配豆浆汉堡搭配
                </h3>
                <div class="detail">
                    <img src="./images/myorder/user.png" alt="">
                    <p>包包</p>
                    <img src="./images/myorder/date.png" alt="">
                    <p>11:30配送</p>
                    <p class="speacil">
                        ¥<span>12.</span>00
                    </p>
                    <div class="clear"></div>
                </div>
                <div class="pay">
                    <p>取消订单</p>
                    <p>立即支付</p>
                </div>
                <div class="clear"></div>
            </a></li>
            <li><a href="#">
                <div class="status">
                    <p>订单编号：abc12345678910<span>待支付</span></p>
                </div>
                <div class="box">
                     <img src="./images/myorder/pic1.jpg" alt="">
                </div>
                <h3>
                    <span>套餐</span>
                    西式早餐搭配豆浆汉堡搭配限时优惠西式早餐搭配豆浆汉堡搭配
                    西式早餐搭配豆浆汉堡搭配限时优惠西式早餐搭配豆浆汉堡搭配
                </h3>
                <div class="detail">
                    <img src="./images/myorder/user.png" alt="">
                    <p>包包</p>
                    <img src="./images/myorder/date.png" alt="">
                    <p>11:30配送</p>
                    <p class="speacil">
                        ¥<span>12.</span>00
                    </p>
                    <div class="clear"></div>
                </div>
                <div class="pay">
                    <p>取消订单</p>
                    <p>立即支付</p>
                </div>
                <div class="clear"></div>
            </a></li>
            <li><a href="#">
                <div class="status">
                    <p>订单编号：abc12345678910<span>待支付</span></p>
                </div>
                <div class="box">
                     <img src="./images/myorder/pic1.jpg" alt="">
                </div>
                <h3>
                    <span>套餐</span>
                    西式早餐搭配豆浆汉堡搭配限时优惠西式早餐搭配豆浆汉堡搭配
                    西式早餐搭配豆浆汉堡搭配限时优惠西式早餐搭配豆浆汉堡搭配
                </h3>
                <div class="detail">
                    <img src="./images/myorder/user.png" alt="">
                    <p>包包</p>
                    <img src="./images/myorder/date.png" alt="">
                    <p>11:30配送</p>
                    <p class="speacil">
                        ¥<span>12.</span>00
                    </p>
                    <div class="clear"></div>
                </div>
                <div class="pay">
                    <p>取消订单</p>
                    <p>立即支付</p>
                </div>
                <div class="clear"></div>
            </a>
            <div class="clear"></div>
        </li>
            <div class="clear"></div>
        </ul>
        <div class="clear"></div>
    </div>
    <div class="nav">
        <ul>
            <li><a href="index.html">
                <span class="iconfont">&#xe615;</span>
                <p>首页</p>
            </a></li>
            <li><a href="order.html">
                <span class="iconfont">&#xe61b;</span>
                <p>点餐</p>
            </a></li>
            <li><a href="myorder.html">
                <span class="iconfont" style="color: #ed545a;">&#xe629;</span>
                <p style="color: #ed545a;">订单</p>
            </a></li>
            <li><a href="mine.html">
                <span class="iconfont">&#xe67a;</span>
                <p>我的</p>
            </a></li>
        </ul>
    </div>
</div>
<script src="./js/jquery-3.5.1.min.js"></script>
<script src="./js/mine.js"></script>
<body>
    
</body>
</html>